// 管理后台移动端适配JavaScript

// 移动端侧边栏控制
function toggleSidebar() {
    const sidebar = document.getElementById('sidebar');
    const overlay = document.querySelector('.sidebar-overlay');
    
    if (sidebar.classList.contains('show')) {
        sidebar.classList.remove('show');
        overlay.classList.remove('show');
        document.body.style.overflow = '';
    } else {
        sidebar.classList.add('show');
        overlay.classList.add('show');
        document.body.style.overflow = 'hidden';
    }
}

// 检测窗口大小变化
window.addEventListener('resize', function() {
    if (window.innerWidth >= 992) {
        // 桌面端：隐藏移动端菜单
        const sidebar = document.getElementById('sidebar');
        const overlay = document.querySelector('.sidebar-overlay');
        if (sidebar) sidebar.classList.remove('show');
        if (overlay) overlay.classList.remove('show');
        document.body.style.overflow = '';
    }
});

// 添加移动端菜单点击事件处理
function addMobileMenuHandler() {
    // 导航菜单点击事件 - 移动端自动关闭侧边栏
    document.querySelectorAll('.sidebar .nav-link').forEach(link => {
        link.addEventListener('click', function() {
            // 移动端：点击菜单项后关闭侧边栏
            if (window.innerWidth < 992) {
                toggleSidebar();
            }
        });
    });
    
    // 侧边栏遮罩层点击关闭
    const overlay = document.querySelector('.sidebar-overlay');
    if (overlay) {
        overlay.addEventListener('click', toggleSidebar);
    }
}

// 页面加载完成后初始化移动端功能
document.addEventListener('DOMContentLoaded', function() {
    addMobileMenuHandler();
});

// 添加移动端头部HTML结构的函数
function createMobileHeader() {
    const mobileHeader = `
        <!-- 移动端头部 -->
        <div class="mobile-header">
            <button class="mobile-menu-btn" onclick="toggleSidebar()">
                <i class="bi bi-list"></i>
            </button>
            <h5 class="mb-0">管理后台</h5>
            <div class="dropdown">
                <button class="btn btn-link dropdown-toggle" type="button" data-bs-toggle="dropdown">
                    <i class="bi bi-person-circle"></i>
                </button>
                <ul class="dropdown-menu dropdown-menu-end">
                    <li><a class="dropdown-item" href="#"><i class="bi bi-person me-2"></i>个人资料</a></li>
                    <li><hr class="dropdown-divider"></li>
                    <li><a class="dropdown-item" href="#" onclick="logout()"><i class="bi bi-box-arrow-right me-2"></i>退出登录</a></li>
                </ul>
            </div>
        </div>
        
        <!-- 侧边栏遮罩层 -->
        <div class="sidebar-overlay"></div>
    `;
    
    // 插入到body的开头
    document.body.insertAdjacentHTML('afterbegin', mobileHeader);
}

// 为侧边栏添加必要的ID和类名
function setupSidebar() {
    const sidebar = document.querySelector('nav.sidebar');
    if (sidebar && !sidebar.id) {
        sidebar.id = 'sidebar';
    }
}

// 通用的退出登录函数
function logout() {
    localStorage.removeItem('adminToken');
    localStorage.removeItem('adminUser');
    window.location.href = '/admin/login.html';
}

// 自动设置页面标题
function setMobilePageTitle(title) {
    const titleElement = document.querySelector('.mobile-header h5');
    if (titleElement) {
        titleElement.textContent = title;
    }
}

// 优化表格在移动端的显示
function optimizeTablesForMobile() {
    const tables = document.querySelectorAll('.table');
    tables.forEach(table => {
        if (!table.parentElement.classList.contains('table-responsive')) {
            const wrapper = document.createElement('div');
            wrapper.className = 'table-responsive';
            table.parentNode.insertBefore(wrapper, table);
            wrapper.appendChild(table);
        }
    });
}

// 页面完全加载后执行的初始化
window.addEventListener('load', function() {
    optimizeTablesForMobile();
}); 